<%@ page contentType="text/html;charset=UTF-8"%>
<%@ include file="/WEB-INF/views/include/taglib.jsp"%>
<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <title><spring:message code="changeMaterial"/></title>
    <%@ include file="/WEB-INF/views/include/head.jsp"%>
    <script src="${ctxStatic}/js/jquery-1.9.1.min.js"></script>
	<link rel="stylesheet" href="${ctxStatic}/css/layerSm.css">
	<link rel="stylesheet" href="${ctxStatic}/css/common_erp.css">
	<script type="text/javascript">
	//获取 iframe 数量 
	var frLength = window.parent.frames.length;
	//父画面下标 
	var parentIndex = frLength-2;
		$(document).ready(function() {
			// 下拉选框带搜索功能
			$("#materialTypeCd").select2();
			$("#materialStyleCategory").select2();
			$("#materialPlacement").select2();
			searchListForm();
		});
		// 检索
		function searchListForm() {
			var materialTypeCd = $("#materialTypeCd").val();
			var materialCd = $("#materialCd").val();
			var materialNameCn = $("#materialNameCn").val();
			var materialStyleCategory = $("#materialStyleCategory").val();
			var materialPlacement = $("#materialPlacement").val();
            var tempMaterialStyle = materialStyleCategory.split("-");
            var tms = tempMaterialStyle[1]+ "_FIT_ITEM";
            $("#activity_pane").showLoading();
			$.post("${ctx}/bigcargo/style/searchForm?materialTypeCd=" + materialTypeCd + "&materialCd=" + materialCd
					+ "&materialNameCn=" + materialNameCn + "&materialStyleCategory="
					+ tms + "&materialPlacement=" + materialPlacement , "",
					function(result) {
						var listHtml = result["StyleOptionList"];
						$("#listHtml").html(listHtml);
						$("#activity_pane").hideLoading();
					}, 'json');
		}
        // 重置
        function clean(){
            $("input").val("");
            $("#searchForm").submit();
        }
        // 选款式 
        function selectedCall(){
        	if ($("#frameFlg").val()==0) {
        		var arr = $("#listHtml").find(".selected");
            	var tbodyTemp = window.parent.frames[parentIndex].document.getElementById("changeMaterialBody");
            	var selectTemp=$("#materialPlacementSelect").clone();
            	$(selectTemp).find("p").remove(".tit_muster");
            	var selectName = $(selectTemp).find("div")[0].innerText;
            	$(selectTemp).find("div").remove(".select2-container");
    			var selectAfterData=$(selectTemp)[0].innerHTML;
    			var lenTr = $(tbodyTemp).find(".select2-chosen").length;
    			var lenTemp = $(tbodyTemp).find("tr").length-1;
    			// 创建提交表单所需的hidden项
            	$.each(arr, function(i, item){
            		var reg =/materialPlacement/g
            		var seTemp = selectAfterData.replace(reg,'changeMaterial.cgMatList['+(i+lenTemp)+'].cgMaterialPlacement');
            		var itemCd = $(arr).eq(i).find("#itemCd")[0].defaultValue;
            		var itemCdHidden = "<input type='hidden' name='changeMaterial.cgMatList["+(i+lenTemp)+"].cgGaterialCd' value='"+itemCd+"'/>";
            		var materialTypeCd = $(arr).eq(i).find("#materialTypeCd")[0].defaultValue;
            		var materialTypeCdTemp = $(arr).eq(i).find("#materialTypeCdTemp")[0].defaultValue;
            		var materialTypeCdHidden = "<input type='hidden' name='changeMaterial.cgMatList["+(i+lenTemp)+"].cgMaterialTypeCd' value='"+materialTypeCdTemp+"'/>";
            		var materialNameCn = $(arr).eq(i).find("#materialNameCn")[0].defaultValue;
            		var materialNameCnHidden = "<input type='hidden' name='changeMaterial.cgMatList["+(i+lenTemp)+"].cgMaterialNameCn' value='"+materialNameCn+"'/>";
            		var materialFile = $(arr).eq(i).find("#materialFile")[0].defaultValue.split("/");
            		var mfileTemp = $(arr).eq(i).find("#materialFile")[0].defaultValue;
            		var len = materialFile.length;
            		var fileUrl = '';
            		for (var j =0;j<(len-1);j++) {
            			fileUrl += materialFile[j]+"/";
            		}
            		var materialFileNameHidden = "<input type='hidden' name='changeMaterial.cgMatList["+(i+lenTemp)+"].cgMaterialFileName' value='"+materialFile[len-1]+"'/>";
            		var materialFilePathHidden = "<input type='hidden' name='changeMaterial.cgMatList["+(i+lenTemp)+"].cgMaterialFilePath' value='"+fileUrl+"'/>";
            		var materialColor = $(arr).eq(i).find("#materialColor")[0].defaultValue;
            		var materialColorHidden = "<input type='hidden' name='changeMaterial.cgMatList["+(i+lenTemp)+"].cgMaterialColor' value='"+materialColor+"'/>";
            		var materialComposition = $(arr).eq(i).find("#materialComposition")[0].defaultValue;
            		var materialCompositionHidden = "<input type='hidden' name='changeMaterial.cgMatList["+(i+lenTemp)+"].cgMaterialComposition' value='"+materialComposition+"'/>";
            		var materialSpec = $(arr).eq(i).find("#materialSpec")[0].defaultValue;
            		var materialSpecHidden = "<input type='hidden' id='materialSpec' name='changeMaterial.cgMatList["+(i+lenTemp)+"].cgMaterialSpec' value='"+materialSpec+"'/>";
            		var materialYearSeason = $(arr).eq(i).find("#materialYearSeason")[0].defaultValue;
            		var materialYear = $(arr).eq(i).find("#materialYear")[0].defaultValue;
            		var materialSeason = $(arr).eq(i).find("#materialSeason")[0].defaultValue;
            		var materialYearHidden = "<input type='hidden' name='changeMaterial.cgMatList["+(i+lenTemp)+"].cgMaterialYear' value='"+materialYear+"'/>";
            		var materialSeasonHidden = "<input type='hidden' name='changeMaterial.cgMatList["+(i+lenTemp)+"].cgMaterialSeason' value='"+materialSeason+"'/>";
            		var materialPlacement = $(arr).eq(i).find("#materialPlacement")[0].defaultValue;
            		var materialRemarks = $(arr).eq(i).find("#materialRemarks")[0].defaultValue;
            		var materialRemarksHidden = "<input type='hidden' class = 'remarks' name='changeMaterial.cgMatList["+(i+lenTemp)+"].cgMaterialRemarks' value='"+materialSeason+"'/>";
            		var materialStageCd = $(arr).eq(i).find("#stageCode")[0].defaultValue;
            		var materialStageCdHidden = "<input type='hidden' name='changeMaterial.cgMatList["+(i+lenTemp)+"].cgMaterialStageCd' value='"+materialStageCd+"'/>";
            		var materialId = $(arr).eq(i).find("#materialId")[0].defaultValue;
            		var materialIdHidden = "<input type='hidden' name='changeMaterial.cgMatList["+(i+lenTemp)+"].cgMaterialId' value='"+materialId+"'/>";
            		var tempDataHidden = itemCdHidden+materialTypeCdHidden+materialNameCnHidden+materialFileNameHidden+materialFilePathHidden+materialColorHidden+materialIdHidden
            						+materialCompositionHidden+materialSpecHidden+materialYearHidden+materialSeasonHidden+materialRemarksHidden+materialStageCdHidden;
            		var tempData = $(tbodyTemp).find("tr").eq(0).clone();
            		var tempDataCells=$(tempData)[0].cells;
            		tempDataCells[1].innerHTML="<img src='"+mfileTemp+"' class='wltp'>";
            		tempDataCells[2].innerHTML=materialNameCn+"<br>" + itemCd;
            		tempDataCells[3].innerText=materialTypeCd;
            		tempDataCells[4].innerText=materialColor;
            		tempDataCells[5].innerText=materialComposition;
            		tempDataCells[6].innerText=materialSpec;
            		tempDataCells[7].innerText=materialYearSeason;
            		tempDataCells[8].innerHTML=seTemp;
            		tempDataCells[9].innerText=materialRemarks;
            		tempDataCells[tempDataCells.length-1].innerHTML=tempDataHidden;
            		$(tempData)[0].className="";
            		tempData.appendTo(tbodyTemp);
           		});
            	window.parent.frames[parentIndex].realoadFun(selectName,"materialPlacementSelect",lenTr,0,false);
            	closeWin();
        	} else if($("#frameFlg").val()==4){
        		var arr = $("#listHtml").find(".selected");
            	var tbodyTemp = window.parent.frames[parentIndex].document.getElementById("changeMaterialBody");
            	var selectTemp=$("#materialPlacementSelect").clone();
            	$(selectTemp).find("p").remove(".tit_muster");
            	var selectName = $(selectTemp).find("div")[0].innerText;
            	$(selectTemp).find("div").remove(".select2-container");
    			var selectAfterData=$(selectTemp)[0].innerHTML;
    			var lenTr = $(tbodyTemp).find(".select2-chosen").length;
    			var lenTemp = $(tbodyTemp).find("tr").length-1;
    			// 创建提交表单所需的hidden项
            	$.each(arr, function(i, item){
            		var reg =/materialPlacement/g
            		var seTemp = selectAfterData.replace(reg,'changeMaterial.cgMatList['+(i+lenTemp)+'].cgMaterialPlacement');
            		var itemCd = $(arr).eq(i).find("#itemCd")[0].defaultValue;
            		var itemCdHidden = "<input type='hidden' name='changeMaterial.cgMatList["+(i+lenTemp)+"].cgGaterialCd' value='"+itemCd+"'/>";
            		var materialTypeCd = $(arr).eq(i).find("#materialTypeCd")[0].defaultValue;
            		var materialTypeCdTemp = $(arr).eq(i).find("#materialTypeCdTemp")[0].defaultValue;
            		var materialTypeCdHidden = "<input type='hidden' name='changeMaterial.cgMatList["+(i+lenTemp)+"].cgMaterialTypeCd' value='"+materialTypeCdTemp+"'/>";
            		var materialNameCn = $(arr).eq(i).find("#materialNameCn")[0].defaultValue;
            		var materialNameCnHidden = "<input type='hidden' name='changeMaterial.cgMatList["+(i+lenTemp)+"].cgMaterialNameCn' value='"+materialNameCn+"'/>";
            		var materialFile = $(arr).eq(i).find("#materialFile")[0].defaultValue.split("/");
            		var mfileTemp = $(arr).eq(i).find("#materialFile")[0].defaultValue;
            		var len = materialFile.length;
            		var fileUrl = '';
            		for (var j =0;j<(len-1);j++) {
            			fileUrl += materialFile[j]+"/";
            		}
            		var materialFileNameHidden = "<input type='hidden' name='changeMaterial.cgMatList["+(i+lenTemp)+"].cgMaterialFileName' value='"+materialFile[len-1]+"'/>";
            		var materialFilePathHidden = "<input type='hidden' name='changeMaterial.cgMatList["+(i+lenTemp)+"].cgMaterialFilePath' value='"+fileUrl+"'/>";
            		var materialColor = $(arr).eq(i).find("#materialColor")[0].defaultValue;
            		var materialColorHidden = "<input type='hidden' name='changeMaterial.cgMatList["+(i+lenTemp)+"].cgMaterialColor' value='"+materialColor+"'/>";
            		var materialComposition = $(arr).eq(i).find("#materialComposition")[0].defaultValue;
            		var materialCompositionHidden = "<input type='hidden' name='changeMaterial.cgMatList["+(i+lenTemp)+"].cgMaterialComposition' value='"+materialComposition+"'/>";
            		var materialSpec = $(arr).eq(i).find("#materialSpec")[0].defaultValue;
            		var materialSpecHidden = "<input type='hidden' id='materialSpec' name='changeMaterial.cgMatList["+(i+lenTemp)+"].cgMaterialSpec' value='"+materialSpec+"'/>";
            		var materialYearSeason = $(arr).eq(i).find("#materialYearSeason")[0].defaultValue;
            		var materialYear = $(arr).eq(i).find("#materialYear")[0].defaultValue;
            		var materialSeason = $(arr).eq(i).find("#materialSeason")[0].defaultValue;
            		var materialYearHidden = "<input type='hidden' name='changeMaterial.cgMatList["+(i+lenTemp)+"].cgMaterialYear' value='"+materialYear+"'/>";
            		var materialSeasonHidden = "<input type='hidden' name='changeMaterial.cgMatList["+(i+lenTemp)+"].cgMaterialSeason' value='"+materialSeason+"'/>";
            		var materialPlacement = $(arr).eq(i).find("#materialPlacement")[0].defaultValue;
            		var materialRemarks = $(arr).eq(i).find("#materialRemarks")[0].defaultValue;
            		var materialRemarksHidden = "<input type='hidden' class = 'remarks' name='changeMaterial.cgMatList["+(i+lenTemp)+"].cgMaterialRemarks' value='"+materialSeason+"'/>";
            		var materialStageCd = $(arr).eq(i).find("#stageCode")[0].defaultValue;
            		var materialStageCdHidden = "<input type='hidden' name='changeMaterial.cgMatList["+(i+lenTemp)+"].cgMaterialStageCd' value='"+materialStageCd+"'/>";
            		var materialId = $(arr).eq(i).find("#materialId")[0].defaultValue;
            		var materialIdHidden = "<input type='hidden' name='changeMaterial.cgMatList["+(i+lenTemp)+"].cgMaterialId' value='"+materialId+"'/>";
            		
            		var materialUnitPriceHidden = "<input type='hidden' class = 'materialUnitPrice' name='changeMaterial.cgMatList["+(i+lenTemp)+"].materialUnitPrice' value='0'/>";
            		var materialLossHidden = "<input type='hidden' class = 'materialLoss' name='changeMaterial.cgMatList["+(i+lenTemp)+"].materialLoss' value='0'/>";
            		var tempDataHidden = itemCdHidden+materialTypeCdHidden+materialNameCnHidden+materialFileNameHidden+materialFilePathHidden+materialColorHidden+materialIdHidden
            						+materialCompositionHidden+materialSpecHidden+materialYearHidden+materialSeasonHidden+materialRemarksHidden+materialStageCdHidden+materialUnitPriceHidden+materialLossHidden;
            		var tempData = $(tbodyTemp).find("tr").eq(0).clone();
            		var tempDataCells=$(tempData)[0].cells;
            		tempDataCells[1].innerHTML="<img src='"+mfileTemp+"' class='wltp'>";
            		tempDataCells[2].innerHTML=materialNameCn+"<br>" + itemCd;
            		tempDataCells[3].innerText=materialTypeCd;
            		tempDataCells[4].innerText=materialColor;
            		tempDataCells[5].innerText=materialComposition;
            		tempDataCells[6].innerText=materialSpec;
            		tempDataCells[7].innerText=materialYearSeason;
            		tempDataCells[8].innerHTML=seTemp;
            		tempDataCells[9].innerText=materialRemarks;
            		tempDataCells[tempDataCells.length-1].innerHTML=tempDataHidden;
            		$(tempData)[0].className="";
            		tempData.appendTo(tbodyTemp);
           		});
            	window.parent.frames[parentIndex].realoadFun(selectName,"materialPlacementSelect",lenTr,0,false);
            	closeWin();
        	} else {
        		var arr = $("#listHtml").find(".selected");
            	var tbodyTemp = window.parent.frames[parentIndex].document.getElementById("listHtml");
            	var len = $(tbodyTemp).find("tr").length-1;
    			// 创建提交表单所需的hidden项
    			$.each(arr, function(i, item){
            		var reg =/materialPlacement/g
            		var materialCode = $(arr).eq(i).find("#itemCd")[0].defaultValue;
            		var materialCodeHidden = "<input type='hidden' class = '' name='bigConsumption.bigConsumptionMaterialList["+(i+len)+"].materialCode' value='"+materialCode+"'/>"; 
            		var materialNameCN = $(arr).eq(i).find("#materialNameCn")[0].defaultValue;
            		var materialNameCNHidden = "<input type='hidden' name='bigConsumption.bigConsumptionMaterialList["+(i+len)+"].materialNameCN' value='"+materialNameCN+"'/>";
            		var materialTypeCd = $(arr).eq(i).find("#materialTypeCd")[0].defaultValue;
            		var materialTypeCdHidden = "<input type='hidden' name='bigConsumption.bigConsumptionMaterialList["+(i+len)+"].materialTypeCd' value='"+materialTypeCd+"'/>";
					var materialSpec = $(arr).eq(i).find("#materialSpec")[0].defaultValue;
            		var materialSpecHidden = "<input type='hidden' name='bigConsumption.bigConsumptionMaterialList["+(i+len)+"].materialSpec' value='"+materialSpec+"'/>";
            		var materialCostHidden = "<input type ='hidden' class = 'materialCost' name ='bigConsumptionMaterialList["+(i+len)+"].materialCost'/>"
            		var materialPreLossHidden = "<input type ='hidden' class = 'materialPreLoss' name ='bigConsumptionMaterialList["+(i+len)+"].materialPreLoss' />"
            		var materialLossHidden = "<input type ='hidden' class = 'materialLoss' name ='bigConsumptionMaterialList["+(i+len)+"].materialLoss' />"
            		var materialUnitPriceHidden = "<input type ='hidden' class = 'materialUnitPrice' name ='bigConsumptionMaterialList["+(i+len)+"].materialUnitPrice'/>"
            		var materialTotalPriceHidden = "<input type ='hidden' class = 'materialTotalPrice' name ='bigConsumptionMaterialList["+(i+len)+"].materialTotalPrice'/>"
            		var remarksHidden = "<input type ='hidden' class = 'remarks' name ='bigConsumptionMaterialList["+(i+len)+"].remarks' />"
            		var materialId = $(arr).eq(i).find("#materialId")[0].defaultValue;
            		var materialIDHidden = "<input type='hidden' class = 'materialID' name='bigConsumptionMaterialList["+(i+len)+"].materialID' value='"+materialId+"'/>"; 
            		var tempDataHidden = materialCodeHidden+materialNameCNHidden+materialTypeCdHidden+materialSpecHidden
            							+materialCostHidden+materialPreLossHidden+materialLossHidden+materialUnitPriceHidden
            							+materialTotalPriceHidden+remarksHidden+materialIDHidden;
            		var mfileTemp = $(arr).eq(i).find("#materialFile")[0].defaultValue;
            		var tempData = $(tbodyTemp).find("tr").eq(0).clone();
            		var tempDataCells=$(tempData)[0].cells;
            		tempDataCells[1].innerHTML="<img src='"+mfileTemp+"' class='wltp'>";
            		tempDataCells[2].innerHTML=materialCode+"<br>" + materialNameCN;
            		tempDataCells[3].innerText=materialTypeCd;
            		tempDataCells[4].innerText=materialSpec;
            		
            		tempDataCells[12].innerHTML=tempDataHidden;
            		
            		$(tempData)[0].className="";
            		tempData.appendTo(tbodyTemp);
           		});
    			
            	window.parent.frames[parentIndex].realoadFun();
            	closeWin();
        		
        	}
        	
        }
        //选择按钮事件
        function selectFunction(obj){
        	// 判断是否被选中
        	var bolSelected = $(obj).hasClass("selected");
        	if (bolSelected) {
        		$(obj).removeClass("selected");
        	} else {
        		$(obj).addClass("selected");
        	}
        }
    </script>
</head>
<body>
<div class="tabBoxSm" id="activity_pane">
     <div class="tabSm smOrderBox" style="width:800px">
        <div class="items clearfix">
            <div class="col-50 clearfix">
                <strong style="font-size:15px;"><spring:message code="changeMaterial"/></strong>
            </div>
            <div class="col-50 clearfix" >
            <div style="float:right;">
               <!-- <button type="button" class="btn-cj">添加</button> -->
               <!-- 选择 -->
               <button type="button" class="btn-cj" onclick="selectedCall()"><spring:message code="style_selectOK"/></button>
               <!-- 重置 -->
               <button type="button" class="btn-js" onclick="clean()"><spring:message code="common_reset"/></button>
               <!-- 检索 -->
               <button type="button" class="btn-js" onclick="searchListForm()"><spring:message code="commom_check"/></button>
               <!-- 关闭 -->
               <button type="button" class="btn-js" onclick="closeWin()"><spring:message code="btn_cancle"/></button>
               </div>
            </div>
            <br><hr></hr>
        </div>
        <div class="items clearfix">
            <div class="col-16 clearfix">
			 <p class="tit_muster"><spring:message code="style_faceAccessoriesCategory"/></p>
			  <select style="width:130px" id="materialTypeCd" name="materialTypeCd">
			   <option value=""><spring:message
									code="order_please_choose" /></option>
			<c:forEach items="${materialList}" var="item">
				<option value="${item.itemCode}-${item.itemValue}">${item.itemName}</option>
			</c:forEach>
			</select>
            </div>
            <div class="col-16 clearfix">
                <p class="tit_muster"><spring:message code="style_fabricCode"/></p>
			<input type="text" id ="materialCd" name ="materialCd" style="width:120px;">
            </div>
            <div class="col-16 clearfix">
                <p class="tit_muster"><spring:message code="style_faceAccessoriesName"/></p>
                <input type="text" id ="materialNameCn" name="materialNameCn" style="width:130px;">
            </div>
        </div>
        <div class="items clearfix">
            <div class="col-16 clearfix haveToBox">
                <p class="tit_muster"><spring:message code="material_showMateial_style"/></p>
                 <select style="width:130px;" id="materialStyleCategory" name="materialStyleCategory">
                 <option value=""><spring:message
									code="order_please_choose" /></option>
					<c:forEach items="${styleList}" var="item">
                        <option
                                <c:if test="${bigcargoStyle.styleCategoryTemp eq item.itemValue}">selected="selected"</c:if>
                                value="${item.itemCode}-${item.itemValue}" tabIndex = "${status.index}">
                                ${item.itemName}</option>
					</c:forEach>
				</select>
            </div>
            <div class="col-16 clearfix" id="materialPlacementSelect">
                <p class="tit_muster"><spring:message code="material_showMateial_placement"/></p>
                 <select style="width: 150px;" id="materialPlacement" name="materialPlacement" >
                  <option value=""><spring:message
									code="order_please_choose" /></option>
				<c:forEach items="${materialPlacement}" var="item">
					<option value="${item.itemCode}-${item.itemValue}" >${item.itemName}</option>
				</c:forEach>
				</select>
            </div>
        </div>
		<div class="items clearfix" style="margin: 0px;">
            <div class="col-16 clearfix" style="width:100%">
                <strong style="font-size:12px;"><spring:message code="style_itemIist"/></strong>
            </div>
        </div>
        <div class="proList clearfix " style="margin-top:-5px;"  id="listHtml">
		</div>
     </div>
</div>
<input type="hidden" id ="frameFlg" value="${bigcargoStyle.frameFlg}">
</body>
</html>
